<!--
  @author: 善良的YWJ
  @Created by shanliangdeYWJ on 2020/09/16 12:28:15
  @file: nav.vue
  @description:
  ==================
  nav 导航外菜单
  ==================
  @link [Github](https://github.com/shanliangdeYWJ)
-->

<template>
  <div class="gf-menu">
    <div class="first-item-box" v-for="(item, index) in lists" :key="index">
      <router-link :to="'/' + item.path+''" :class="item.class">{{item.name}}</router-link>
      <menu-item :lists="item.children" :path="'/' + item.path+'/'"></menu-item>
    </div>
  </div>
</template>

<script>
import MenuItem from '@/components/menu-item.vue';
export default {
  name: 'GFMenu',
  props: {
    lists: {
      type: Array,
      require: true
    }
  },
  components: {
    MenuItem
  }
};
</script>

<style lang='scss' scoped>
.first-item-box {
  display: inline-block;
}
</style>
